<template>
<div>
  <el-dialog :title="'人员履历历史信息'" :visible.sync="visible" class="mod-config" top="8vh" width="70%">
    <basic-container>
      <div class=" zhiBiao avue-crud" style="max-height: 50vh;">
<!--        <div class="flex justifyContentSpaceBetween">-->
<!--          <div class="tabletext">人员履历历史信息</div>-->
<!--        </div>-->
          <div style="margin-bottom:20px;">
            <el-tooltip
                class="item"
                effect="dark"
                content="修改"
                placement="top"
            >
                <el-button
                icon="el-icon-edit"
                type="warning"
                circle
                v-if="permissions.jiangjin_jiangjinryllb_edit"
                @click="addOrUpdateHandle()"
                ></el-button>
            </el-tooltip>
            <el-tooltip
                class="item"
                effect="dark"
                content="批量删除"
                placement="top-start"
            >
                <el-button
                type="danger"
                icon="el-icon-delete"
                 v-if="permissions.jiangjin_jiangjinryllb_del"
                @click="deleteHandle()"
                circle
                ></el-button>
            </el-tooltip>
            <div class="pull-right">
                <el-button @click="chaiFen()" type="warning">拆分</el-button>
            </div>
          </div>
          <el-table :data="dataList" v-loading="dataListLoading" header-align="center" border ref="table" stripe   class="avue-crud" style="max-height:calc(100vh - 475px)">
            <el-table-column type="selection" width="55" header-align="center" align="center"></el-table-column>
             <el-table-column prop="" label="序号" width="60px" :formatter="nShowIndex" align="center" ></el-table-column>
            <el-table-column prop="ryXm" label="姓名" width="100px"align="center">
            </el-table-column>
             <!-- <el-table-column prop="jjFfDeptName" show-overflow-tooltip label="奖金发放单位" min-width="150px" align="center">
            </el-table-column> -->
            <el-table-column prop="ryZwgz" label="职务" min-width="150px"align="center">
            </el-table-column>
              <el-table-column prop="ryXzjb" label="职级" min-width="100px"align="center">
            </el-table-column>
            <el-table-column prop="llKssj" :formatter="formater" label="开始日期" width="150px"align="center">
            </el-table-column>
            <el-table-column prop="llJssj" :formatter="formater" label="结束日期" width="150px"align="center">
            </el-table-column>
            <el-table-column prop="jjFfMonth" label="任职时长(月)" width="150px"align="center">
            </el-table-column>

            <!-- <el-table-column label="操作"  width="180">
              <template slot-scope="scope">
                <el-button v-if="permissions.jiangjin_jiangjinryllb_edit" type="primary" plain
                  @click="addOrUpdateHandle(scope.row)">修改</el-button>
                <el-button v-if="permissions.jiangjin_jiangjinryllb_del" type="danger" plain
                  @click="deleteHandle(scope.row)">删除</el-button>
              </template>
            </el-table-column> -->
          </el-table>
<!--        <div class="avue-crud__pagination">-->
<!--          <el-pagination @size-change="sizeChangeHandle" @current-change="currentChangeHandle" :current-page="pageIndex"-->
<!--            :page-sizes="[10, 20, 50, 100]" :page-size="pageSize" :total="totalPage" background-->
<!--            layout="total, sizes, prev, pager, next, jumper">-->
<!--          </el-pagination>-->
<!--        </div>-->
      </div>
      <!-- 弹窗, 新增 / 修改 -->
      <TableForm v-if="addOrUpdateVisible" ref="addOrUpdate" @refreshDataListEdit="getDataListEdit"></TableForm>
      
    </basic-container>
  </el-dialog>
  <!--拆分-->
      <el-dialog
        title="拆分"
        :visible.sync="chaiDialogVisible"
        width="30%"
        center>
        <div>
          <el-col style="margin-bottom:10px;" :span="24" v-for="(item,index) in timeList" :key="index">
            <el-col :span="11">
              <span>开始时间:</span>
              <el-date-picker
                v-model="item.startTime"
                type="date"
                format='yyyy-MM-dd'
                value-format='yyyy-MM-dd'
                :picker-options="startDatePicker"
                @blur="changeStartDate(item,index)"
                placeholder="选择日期">
              </el-date-picker>
            </el-col>
            <el-col :span="11">
              <span>结束时间:</span>
              <el-date-picker
                v-model="item.endTime"
                type="date"
                format='yyyy-MM-dd'
                value-format='yyyy-MM-dd'
                :picker-options="startDatePicker"
                @blur="changeStartDate(item,index)"
                placeholder="选择日期">
              </el-date-picker>
            </el-col>
            <el-col :span="2">
              <el-button type="primary" style="margin-top:28px;" icon="el-icon-minus" v-if="timeList.length>1" @click="detTime(index)" plain></el-button>
            </el-col>
          </el-col>
          <el-button type="primary" icon="el-icon-plus" @click="addTime()" plain></el-button>
          
        </div>
        <span slot="footer" class="dialog-footer">
          <el-button type="primary" @click="subTime()">确 定</el-button>
          <el-button @click="chaiDialogVisible = false">取 消</el-button>
        </span>
      </el-dialog>
  </div>
</template>

<script>
  import { getListByRyCode ,delObj,deleteBatch,updateRyllbData} from '@/api/jiangjin/jiangjinryllb'
  import store from '@/store'
  import { mapGetters } from 'vuex'
  import TableForm from './jiangjinryllb-form'
  var selectionList=[]
  export default {
    data() {
      return {
        ryCode:'',
        visible:false,
        dataList: [],
        pageIndex: 1,
        pageSize: 10,
        totalPage: 0,
        dataListLoading: false,
        addOrUpdateVisible: false,
        chaiDialogVisible:false,
        timeList:[],
        //开始时间
        startDatePicker: {
          disabledDate(time) {
            let dateStr=selectionList[0].llKssj
            let dateEnd=selectionList[0].llJssj
            let newstr = dateStr.replace(/-/g,'/'); 
            let newEnd = dateEnd.replace(/-/g,'/'); 
            let startDate = (new Date(newstr)).getTime();
            let endDate = (new Date(newEnd)).getTime();
            return time.getTime() < startDate || time.getTime() > endDate
          }
        },
        chaiId:"",
        cfendTime:""
      }
    },
    components: {
      TableForm
    },

    computed: {
      ...mapGetters(['permissions'])
    },
    methods: {
      //提交拆分
      subTime(){
        var params={
          id:this.chaiId,
          timearray:this.timeList
        }
          console.log(JSON.stringify(params))
          updateRyllbData(params).then(res=>{
            this.$message.closeAll()
            if(res.data.code==0){
              this.$message.success('拆分成功!')
              this.visible=false;
              this.chaiDialogVisible=false;
            this.$emit('refreshDataList')
            }
            
          })
      },
      //拆分
      chaiFen(){
        var data=this.$refs.table.selection
        selectionList=data
        if (data.length == 0) {
          this.$message.closeAll();
          this.$message.error("请选择一条要修改的数据！");
          return;
        }
        if (data.length >1) {
          this.$message.closeAll();
          this.$message.error("只能选择一条数据修改！");
          return;
        }
        if(data.length==1){
          this.chaiDialogVisible=true;
          this.chaiId=data[0].id
          this.timeList=[
            {startTime:data[0].llKssj,endTime:data[0].llJssj}
          ]
        }
      },
      //添加时间段
      addTime(){
        var obj={
          startTime:'',
          endTime:''
        }
        this.timeList.push(obj)
        this.timeList.forEach((item,index)=>{
          if(index==(this.timeList.length-1)){
            item.endTime=selectionList[0].llJssj;
            var timer = this.cfendTime.substring(0,10)
            item.startTime = this.addMonth(timer,1)
          }else{
            item.endTime=item.endTime;
          }
          
        })
      },
      addMonth(d,m){
        var ds=d.split('-'),_d=ds[2]-0;
        var nextM=new Date( ds[0],ds[1]-1+m+1, 0 );
        var max=nextM.getDate();
        d=new Date( ds[0],ds[1]-1+m,_d>max? max:_d );
        return d.toLocaleDateString().match(/\d+/g).join('-')
      },
      detTime(index){
        this.timeList.splice(index,1)
      },
      changeStartDate(item,index){
        
        let startYear=this.zHyear(item.startTime)
        let endYear=this.zHyear(item.endTime)
        let startMonth=this.zHmonth(item.startTime+1)
        let endtMonth=this.zHmonth(item.endTime)
        let startDate=this.zHdate(item.startTime)
        let endDate=this.zHdate(item.endTime)
        let lastMonth,lastYear,lastDate
        this.$message.closeAll()
        if(index>0){
           lastMonth=this.zHmonth(this.timeList[index-1].endTime)
           lastYear=this.zHyear(this.timeList[index-1].endTime)
           lastDate=this.zHdate(this.timeList[index-1].endTime)
        }  
        if(startYear==endYear){
          if(startMonth<lastMonth){
            this.$message.warning('开始日期不能小于或等于上个结束日期')
            this.timeList[index].startTime=''
            return
          }
          
          if(endtMonth<startMonth){
            this.$message.warning('结束日期不能小于或等于上个开始日期')
            this.timeList[index].endTime=''
            return
          }
          if(endtMonth==startMonth){
            if(endDate<=startDate){
              this.$message.warning('结束日期不能小于或等于上个开始日期')
              this.timeList[index].endTime=''
              return
            }
          }
          if(startMonth==lastMonth){
            if(startDate<=lastDate){
              this.$message.warning('开始日期不能小于或等于上个结束日期')
              this.timeList[index].startTime=''
              return
            }
          }
        }
        if(startYear==lastYear){
          if(startMonth<lastMonth){
            this.$message.warning('开始日期不能小于或等于上个结束日期')
            this.timeList[index].startTime=''
            return
          }
          if(startMonth==lastMonth){
            if(startDate<=lastDate){
              this.$message.warning('开始日期不能小于或等于上个结束日期')
              this.timeList[index].startTime=''
              return
            }
          }
        }
        if(startYear<lastYear){
            this.$message.warning('开始日期不能小于或等于上个结束日期')
            this.timeList[index].startTime=''
            return
        }
        if(endYear<startYear){
          this.$message.warning('结束日期不能小于或等于开始日期')
            this.timeList[index].endTime=''
            return
        }
        
        this.cfendTime = this.timeList.slice(-1)[0].endTime + "-"+"01"
      },
      zHdate(date){
        if(date.substring(8,9)==0){
              date=date.substring(9,10)
          }else{
              date=date.substring(8,10)
          }
          return date*1
      },
      zHmonth(month){
        if(month.substring(5,6)==0){
              month=month.substring(6,7)
          }else{
              month=month.substring(5,7)
          }
          return month*1
      },
      zHyear(year){
          year=year.substring(0,4)
          return year*1
      },
      //修改
      addOrUpdateHandle(row) {
        var data=this.$refs.table.selection
       
        if (data.length == 0) {
          this.$message.closeAll();
          this.$message.error("请选择一条要修改的数据！");
          return;
        }
        if (data.length >1) {
          this.$message.closeAll();
          this.$message.error("只能选择一条数据修改！");
          return;
        }
        if(data.length==1){
          this.ryCode = "";
          this.ryCode = data[0].ryCode;

          this.addOrUpdateVisible = true
          this.$nextTick(() => {
            this.$refs.addOrUpdate.init(data[0].id)
          })
        }
        
      },
      // 删除
      deleteHandle () {
        var data=this.$refs.table.selection
        if (data.length == 0) {
          this.$message.closeAll();
          this.$message.error("请选择一条要删除的数据！");
          return;
        }
        if(data.length>0){
          // 这里要测试
          let _that = this;
          // this.ryCode = "";
          // this.ryCode =row.ryCode;
          var ids=data.map(item=>{
            return item.id
          })
      
      
          var params={
              ids:ids.toString()
          }
          this.$confirm('是否确认删除', '提示', {
            confirmButtonText: '确定',
            cancelButtonText: '取消',
            type: 'warning'
          }).then(function () {
            deleteBatch(params).then(data => {
              _that.$notify.closeAll();
              _that.$notify.success('删除成功')
              //console.log(_that.roleCode);
              _that.getDataList(_that.ryCode)
            })
          })
        }
        
      },
      getDataListEdit(){
        this.getDataList(this.ryCode);
        this.$emit('refreshDataList')
      },
      // 获取数据列表
      getDataList(ryCode,id) {
        this.visible=true;
        this.ryCode=ryCode
        this.dataListLoading = true
        getListByRyCode(ryCode).then(res=>{
           this.dataList = res.data.data;
        });
        // this.totalPage = response.data.data.total
        this.dataListLoading = false
      },
      // 每页数
      sizeChangeHandle(val) {
        this.pageSize = val
        this.pageIndex = 1
        this.getDataList()
      },
      // 当前页
      currentChangeHandle(val) {
        this.pageIndex = val
        this.getDataList()
      },

      nShowIndex(row, column, cellValue, index) {
        return index + 1;
      },
              formater(row, column, cellValue, index){
         if(cellValue){
        return this.$moment(cellValue).format("YYYY-MM-DD");
      }else {
        return cellValue;
      }
      }
    }
  }

</script>
